<script setup>
import { ref, onMounted, defineEmits, defineProps } from 'vue';
import { message } from 'ant-design-vue';
import { resumeInfoStore } from "@/stores/modules/resume.js";
import {getResumeFile, sendResume} from "@/api/file.js";
import { EyeOutlined } from '@ant-design/icons-vue';
import PdfPreview from "@/components/PdfPreview.vue";

const fileList = ref([]);
const previewUrl = ref('');
const pdfPreviewRef = ref(null);
const fileType = ref('');
const selectedItem = ref(null);  // 存储当前选中的项

// 获取文件列表数据
onMounted(async () => {
  await updateResume();
});

const props = defineProps({
  jobInfo: {
    type: Object,
    required: true,  // 修改为 Object 类型
  },
  open: {
    type: Boolean,
    required: true,
  },
})

const emit = defineEmits(['update:open'])

// 文件点击预览
const onResumeInfo = async (file) => {
  try {
    pdfPreviewRef.value.togglePreview()
    fileType.value = 'pdf';
    previewUrl.value = file.filePath
  } catch (error) {
    message.error('文件预览失败: ' + error.message);
  }
};

const updateResume = async () => {
  try {
    const res = await getResumeFile();
    if (res.data.code === 200) {
      resumeInfoStore().setResumeInfo(res.data.data);
      fileList.value = resumeInfoStore().resumeInfo;
    } else {
      message.error(res.data.message);
    }
  } catch (e) {
    message.error('出错了');
  }
};

// 发送简历消息
const handleSendMessage = async() => {
  console.log(selectedItem.value)
  try{
    const res = await sendResume({
      fileId: selectedItem.value,
      jobId: props.jobInfo.jobId
    })
    if(res.data.code === 200){
      message.success('申请成功')
    }else {
     throw new Error('申请失败')
    }
  }catch(err){
    message.error(err.message);
  }finally {
    emit('update:open', false)
  }
};

const selectStyle = {
  width: "100%",
};
</script>

<template>
  <a-modal title="申请岗位" :open="open" @ok="handleSendMessage" ok-text="发送" cancel-text="取消"
           @cancel="emit('update:open', false)">
    <!-- 显示岗位标题 -->
    <h3>{{ jobInfo.title }}</h3>

    <a-select v-model:value="selectedItem" :placeholder="'请选择简历'" size="large" :style="selectStyle" option-label-prop="children">
      <a-select-option v-for="item in fileList" :key="item.fileId" :title="item.fileName" >
        <div>
          <a-row>
            <a-col span="18">{{ item.fileName }}</a-col>
            <a-col span="6">
              <a-button-group>
                <a-button type="primary" @click="onResumeInfo(item)">
                  <EyeOutlined/>
                  预览
                </a-button>
              </a-button-group>
            </a-col>
          </a-row>
        </div>
      </a-select-option>
    </a-select>

    <a-empty v-if="fileList.length === 0">暂无附件简历</a-empty>
    <PdfPreview ref="pdfPreviewRef" :preview-url="previewUrl" :file-type="fileType"/>
  </a-modal>
</template>

<style scoped>
/* 简历列表样式 */
a-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

a-button {
  margin-left: 10px;
}

.selected-item {
  background-color: #e6f7ff; /* 淡蓝色背景 */
}
</style>
